<template>
  <div>
    <div class="title">一键求救人员</div>
    <xTable
      v-model:refresh="refresh"
      :columns="tableColumns"
      http-data-key="data"
      :http="{
        list: querySeekHelpPersonnel,
      }"
      :scroll="{ y: 400, maxHeight: 400 }"
    >
      <template #seek_help_time="{ row }">
        {{ parseTime(row.seek_help_time) }}
      </template>
    </xTable>
  </div>
</template>

<script lang="ts">
  import { reactive, ref, defineComponent } from 'vue';
  import { querySeekHelpPersonnel } from '@/api/dashboard';
  import { parseTime } from '@/utils/index';

  export default defineComponent({
    setup: () => {
      const refresh = ref(true);
      const tableColumns = reactive([
        { title: '姓名', dataIndex: 'nick_name' },
        {
          title: '求救时间',
          dataIndex: 'seek_help_time',
          slotName: 'seek_help_time',
        },
      ]);
      return {
        refresh,
        tableColumns,
        parseTime,
        querySeekHelpPersonnel,
      };
    },
  });
</script>

<style lang="less" scoped>
  .title {
    font-size: 18px;
    font-weight: 600;
    color: #333333;
    line-height: 28px;
    margin-bottom: 22px;
  }
</style>
